<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>proxy</title>
</head>

<body>

</body>
<script>
    // proxy 作用：
    //      可以给对象添加一个代理：将来所有的赋值&取值都是通过 porxy 代理来操作
    var obj = {}
    // 给 obj 添加一个 proxy 代理对象
    var p = new Proxy(obj, {
        // 将来给 obj 中的任意属性赋值时会触发这个方法：set
        set: function (obj, prop, value) {
            console.log('set：赋值')
            // console.log(obj) // 被代理的对象
            // console.log(prop) // 赋值的属性名
            // console.log(value) // 赋值的属性值
            // 将赋值保存起来
            obj[prop] = value
        },
        // 将来从 obj 中取创见任意属性时会触发这个方法：get
        get: function (obj, prop) {
            console.log('get：取值')
            // console.log(obj) // 被代理的对象
            // console.log(prop) // 赋值的属性名
            // 将取返回
            return obj[prop]
        }
    })
</script>

</html>